<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>总结作业</title>
    <link rel="stylesheet" href="./css/Reset.css">
    <link rel="stylesheet" href="./css/index.css">
</head>
<body>
    <div id="title">html+css概述和总结</div>
    <a href="" class="test1">一.创建快捷方式</a>
    <ul class="first">
        <li><a href="">1.shift+alt+a  或者  ctrl+/  (添加或者取消注释)</a></li>
        <li><a href="">2.快速创建一个html文档结构(模版)</a></li>
        <li><a href="">3.方法一： shift + !    (都是英文状态)</a></li>
        <li> <a href="">4.方法二： html:5</a></li>
    </ul>
    <a href="" class="test2">二.介绍了初识文档</a>
    <ul class="second">
        <li><a href="">1.文档声明<!DOCTYPE html></a></li>
        <li><a href="">2.head 里面包含meta,还有title</a></li>
        <li><a href="">3.body:页面里面所有内容都显示在body</a></li>
    </ul>
    <a href="" class="test3">三.对css的引用</a>
    <ul class="three">
        <li><a href="">1.使用内部样式表:style  项目中不推荐</a></li>
        <li><a href="">2.外部样式表:新建css文件,在css文件里面写样式,然后引入到html文件中</a></li>
        <li><a href="">3. 行内样式引入css 
           <!--  <h2 style="color: aqua; font-size: 40px;">html+css概述</a></li> -->
        </a></li>
        <li><a href="">4.注意link 写到 head的最后面 </a></li>
        <li><a href="">5.先引入初始化css文件 , 在写入自己的css文件 </a></li>
    </ul>
    <a href="" class="test4">四.对css选择器的介绍</a>
    <ul class="four">
        <li><a href="">1.元素选择器：选择页面中元素名相同的元素</a></li>
        <li><a href="">2.类选择器:选择页面中所以类名相同的选择器
            </a></li>
        <li><a href="">注意：一个元素可以有多个类名 多个类名之间用空格分开
                取名原则：不能数字开头，不能拼音，望文知意</a></li>
        <li><a href=""> 3.ID选择器:选择页面中唯一ID名的选择器
            注意:id具有唯一性,一个页面中id不能重复</a></li>
        <li><a href=""> 4. * ：通配符标签
            选择所有的标签，一般来清除浏览器的默认样式 </a></li>
        <li><a href="">注意一个标签既可以有类选择器,也可以有id选择器,多个选择器用空格分开</a></li>
    </ul>
    <div class="test5">
        <img src="./img/dt.jpg" alt="这是湖北省地图" title="这是湖北省地图" class="area">
    </div>
    <a href="" class="return">返回顶部</a>
</body>
</html>
